{% extends 'wxchat/wxbase.html' %}{% load static %}
{% block extra %}
    <style>
    .pet_img{
        width:6.5em;height:6.5em;margin-right:5px;display:block;
    }
    .weui-flex__item{
        font-size: 16px;
    }
    .weui-flex__item span{
        color:#c0c0c0;
        font-size: 14px;
    }
    .pet_bgcolor{
       background-color:#f46253;
    }
    </style>
{% endblock %}
{% block tabpanel %}
<div class="weui-tab__content weui-tab__panel_active" >
    <div class="weui-panel weui-panel_access">
        <div class="weui-panel__hd">
            <div class="weui-flex">
                <div class="weui-flex__item"><a href="javascript:window.history.back(-1)"><i class="icon iconfont icon-jiantou3 gray " ></i></a></div>
                <div class="weui-flex__item" style="margin-top:5px;"><span class="title"  >寄养宠物列表</span></div>
                <div class="weui-flex__item"><a href="{% url 'dog-index' %}?next={{ request.get_full_path }}"><i class="icon iconfont icon-shouye2 pink r" ></i></a></div>
             </div>
        </div>
        <div class="weui-panel__bd" id="pets">
            <div class="weui-cells__title">寄养宠物列表</div>
            <div class="weui-cells">
                {% for pet in pet_list %}
                    <a class="weui-cell weui-cell_access" href="{% url 'foster-pet-detail' pet.id %}">
                    <div class="weui-cell__hd"><img src="{{ pet.picture.url }}" class="pet_img"></div>
                    <div class="weui-cell__bd">
                        <div class="weui-flex">
                            <div class="weui-flex__item"><span>昵称：</span>{{ pet.name }} </div>
                         </div>
                         <div class="weui-flex">
                            <div class="weui-flex__item"><span>品种：</span>{{ pet.type }}</div>
                            <div class="weui-flex__item"><span>毛色：</span>{{ pet.color }}</div>
                         </div>
                         <div class="weui-flex">
                            <div class="weui-flex__item"><span>生日：</span>{{ peet.birthdate }}</div>
                         </div>
                         <div class="weui-flex">
                             <div class="weui-flex__item"><span>性别：</span>{{ pet.get_sex_display }}</div>
                            <div class="weui-flex__item"><span>绝育：</span>{{ pet.get_sterilization_display }}</div>
                         </div>
                    </div>
                    <div class="weui-cell__ft"></div>
                    </a>
                {% endfor %}
            </div>
        </div>
    </div>
</div>
{% endblock tabpanel %}

{% block bottomjs %}

    {{ block.super }}
    <script>

    </script>
{% endblock bottomjs %}
